<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>注册页</title>
    <#assign base=request.contextPath  />
    <link rel="stylesheet" href="../frame/layui/css/layui.css">
    <link rel="stylesheet" href="../frame/static/css/style.css">
    <link rel="icon" href="../frame/static/image/code.png">
    <script src="${base}/js/jquery-1.8.3.min.js"></script>
</head>
<body class="login-body body">

<div class="login-main">
	
    <header class="layui-elip" style="margin-top: 120px;">注册账户</header>
    <form class="layui-form layui-form-pane" method="get" action="">
        
        <div class="layui-form-item">
            <div class="layui-input-inline">
                <input type="text" id="phone" name="phone" class="layui-input" lay-verify="account" placeholder="手机号" />
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-inline" style="float: left;">
                <input type="text" id="code" name="code" class="layui-input" style="width:200px; float: left;" lay-verify="pwd" placeholder="验证码" maxlength="20"/>
                 <button  class="layui-input" style="width:150px; float: left;" onclick="getsms()" type="button">获取验证码</button>
            </div>  
        </div>
      <div class="layui-form-item">
            <div class="layui-input-inline">
                <input type="password" id="password" name="password" class="layui-input" lay-verify="password" placeholder="输入密码" />
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-inline">
                <input type="text" name="confirm" class="layui-input" lay-verify="twopassword" id="confirm" placeholder="再次输入密码" />
            </div>
        </div>
        <div class="layui-input-inline login-btn">
            <button type="button" class="layui-btn layui-btn-danger" style="color:white;" onclick="regist()" id="confirm">注册</button>
        </div>
        <hr/>
        <p><a href="login.html" class="fl" style="color: #666666;">已有账号？立即登录</a></p>
    </form>
</div>
<script src="../frame/layui/layui.js"></script>
<script type="text/javascript">
    layui.use(['form'], function () {
        var form = layui.form
            ,$   = layui.jquery;
             // 操作对象
        var form = layui.form
                , layer = layui.layer
                , $ = layui.jquery;

        // 验证
        form.verify({
            account: function (value) {
                if (value == "") {
                    return "请输入手机号";
                }
            },
            pwd: function (value) {
                if (value == "") {
                    return "请输入验证码";
                }
            },
             password: function (value) {
                if (value == "") {
                    return "请输入密码";
                }
            },
            twopassword: function (value) {
                if (value == "") {
                    return "请输入密码";
                }else if (value !=$("#password").val()) {
                    return "两次密码输入不一致";
                }
            },
            
        });

        // 提交监听
        form.on('submit(sub)', function (data) {
            window.location.href='index.html'
        });
    });
    function getsms(){
        var btn = document.getElementsByTagName('button')[0];
            var time = 60; //定义时间变量。用于倒计时用
            var timer = null; //定义一个定时器；
            timer = setInterval(function() { ///开启定时器。函数内执行
                btn.disabled = true;
                btn.innerText = time + "秒后重新发送"; //点击发生后，按钮的文本内容变成之前定义好的时间值。
                time--; //时间值自减
                if (time == 0) { //判断,当时间值小于等于0的时候
                    btn.innerText = '获取验证码'; //其文本内容变成……点击重新发送……
                    btn.disabled = false;
                    clearInterval(timer); //清除定时器
                }
            }, 1000);
        setTimeout(function(){
            $.ajax({
                type:"POST",
                url:"${base}/comUser/SendSMS",
                data:{userPhone:$("#phone").val()},
                async:false,
                success:function (data) {

                    layer.msg(data);

                }
            })
        },1000)

    }

    // function confirm() {
    //     var first=$("#password").val();
    //     var sec=$("#confirm").val()
    //     if (first!=sec) {
    //         alert("两次输入密码不一致")
    //     }
    // }
    function regist(){
        var first=$("#password").val();
        var sec=$("#confirm").val();
        if (first!=sec) {
            alert("两次输入密码不一致")
        }else {
        $.ajax({
            type:"POST",
            url:"${base}/comUser/equalsCache",
            data:{callPhone:$("#phone").val(),code:$("#code").val(),password:$("#password").val()},
            success:function (data) {

                if (data==false){
                    alert("注册失败");
                }else {
                    alert("注册成功,返回登录界面");
                    window.location.href="${base}/comUser/login.html";

                }
            }
        });}
    }

</script>
</body>
</html>